<template>
  <div >
    <el-card>
      <!-- 顶部面包屑标识与导航 -->
      <el-breadcrumb separator-class="el-icon-arrow-right" style="font-size: 16px;">
        <el-breadcrumb-item :to="{ path: '/' }">
          <i class="el-icon-s-promotion"></i> 后台管理
        </el-breadcrumb-item>
        <el-breadcrumb-item>文章管理</el-breadcrumb-item>
      </el-breadcrumb>
      <el-divider></el-divider>
      <el-row  style="margin-top: 10px">
        <el-button type="primary" @click="openAddNewDialog()" style="margin-left: 10px">新增</el-button>
        <el-button type="primary" @click="openPassList()" style="margin-left: 10px">审核通过列表</el-button>
        <el-button type="primary" @click="openNoPassList()" style="margin-left: 10px">待审核列表</el-button>
        <el-button type="primary" @click="openBackList()" style="margin-left: 10px">退回列表</el-button>

        <download-excel
            style="float: left"
            class="export-excel-wrapper"
            :data="blogData"
            type="xls"
            worksheet="worksheet"
            name="用户信息">
          <el-button type="primary">导出</el-button>
        </download-excel>
      </el-row>

       <router-view/>

      <!-- 文章正文 -->
      <el-drawer
          title="正文内容"
          :visible.sync="contentFormVisible"
          direction="btt">
        <div v-html="this.content"></div>
      </el-drawer>
      <!--   修改类别的表单     -->
      <el-dialog title="修改类别" :visible.sync="editFormVisible">
        <el-form :model="editForm" :rules="editRules" label-width="120px">
          <el-form-item label="父级类别" prop="typeId">
            <el-cascader
                v-model="editForm.parentId"
                :placeholder="editForm.parentName"
                :options="categoryDataOptions"
                :props="{checkStrictly: true}"
                clearable="true"
                @change="handleChange"></el-cascader>
          </el-form-item>
          <el-form-item label="类别名称" prop="name">
            <el-input v-model="editForm.name"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="editFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="handleEdit">确 定</el-button>
        </div>
      </el-dialog>
    </el-card>
  </div>
</template>

<script>

export default {
  name: "Blog",
  data(){
    return{
      // 分页相关数据
      currentPage: this.$router.currentRoute.query.page ? parseInt(this.$router.currentRoute.query.page) : 1,
      pageSize: '',
      total:'',
      content:'',
      contentFormVisible:false,
      editRules:[],
      categoryDataOptions:[],
      blogData:[],
      newForm:{},
      editForm:{},
      currentNoPassPage:''
    }
  },
  methods:{
    changePage(page) {
      this.$router.replace('?page=' + page);
      this.loadBlogList();
    },
    handleChange(){},

    // 打开审核退回确认框
    openBackConfirm(row) {
      if(this.$router.currentRoute.path.includes("/admin/blog/unCheck")){
        location.reload();
        return
      }
      this.$router.push('/admin/blog/unCheck')
    },
    //获取已退回文章列表
    openBackList(){
      if(this.$router.currentRoute.path.includes("/admin/blog/rejectCheck")){
        location.reload();
        return
      }
      this.$router.push('/admin/blog/rejectCheck')
    },
    // 处理退回
    handleBack(row) {

    },
    // 打开新增对话框
    openAddNewDialog(category) {
      this.$router.push("/articlePost")
    },
    loadCategoryTreeList() {
      let url = 'http://localhost:8080/v1/category/tree';

      console.log('url = ' + url);

      this.axios
          .create({'headers': {'Authorization': localStorage.getItem('localJwt')}})
          .get(url).then((response) => {
        let jsonResult = response.data;
        if (jsonResult.code === 1) {
          this.categoryDataOptions = jsonResult.data;
          console.log(jsonResult.data.list)
        }
      }).catch(err => {
        let message = '服务器响应错误！';
        this.$alert(message, '操作失败', {
          confirmButtonText: '确定',
          callback: action => {
          }
        });
      });
    },
    // 加载文章列表
    openPassList() {
      if(this.$router.currentRoute.path.includes("/admin/blog/checkSuccess")){
        location.reload();
        return
      }
     this.$router.push('/admin/blog/checkSuccess')
    },
    // 加载待审核文章列表
    openNoPassList(){
      if(this.$router.currentRoute.path.includes("/admin/blog/unCheck")){
        location.reload();
        return
      }
      this.$router.push('/admin/blog/unCheck')
    },
  },
  mounted() {
    this.loadCategoryTreeList();
  }
}
</script>

<style scoped>

</style>